
window.indexedDB=window.indexedDB||window.webkitIndexedDB||window.mozIndexedDB||window.msIndexedDB;
window.IDBTransaction=window.IDBTransaction||window.webkitTransaction||window.msTransaction;
window.IDBKeyRange=window.IDBKeyRange||window.webkitIDBKeyRange||window.msIDBKeyRange;
window.IDBCursor=window.IDBCursor||window.webkitIDBCursor||window.msIDBCursor;
var dbName='Data';
var dbVersion='2017';
var idb,datatable;
var data;
var NAME;
function window_onload() {
    var dbConnect=window.indexedDB.open(dbName,dbVersion);
    dbConnect.onsuccess=function (e) {
        idb = e.target.result;

    };
    dbConnect.onerror=function () {
        alert("连接数据库失败");
    };
    dbConnect.onupgradeneeded=function (e) {
        idb = e.target.result;
        var storename='customer';
        var optionalParameters={
            keyPah:'id',
            autoIncrement:true
        };
        var store = idb.createObjectStore(storename, optionalParameters);
        alert('对象仓库创建成功');
        var indexname='nameIndex';
        var keyPath='name';
        var optionalParameters={
            unique:true,
            multiEntry:false
        };
        var idx=store.createIndex(indexname,keyPath,optionalParameters);//创建数索引
        alert('索引创建成功');
    };
}
//单击“提交”按钮时执行
function btnAdd_onclick() {
    data = new Object();
    data.Name=document.getElementById("tbxName").value;
    data.Phone=document.getElementById("tbxPhone").value;
    data.Add=document.getElementById("tbxAdd").value;
    var tx=idb.transaction(['customer'],"readwrite");

    var chkErrorMsg="";
    tx.oncomplete=function () {          //追加数据成功后执行
        if(chkErrorMsg!="")
            alert(chkErrorMsg);
        else{
            btnClear_onclick();
        }
    }
    tx.onabort=function () {
        alert('上传失败');
    }

    var store=tx.objectStore('customer');
    var idx=store.index('nameIndex');
    var range = IDBKeyRange.only(data.Name);
    var direction="next";
    var req =idx.openCursor(range,direction);
    req.onsuccess=function () {
        var cursor=this.result;
            var value ={
                name:data.Name,
                phone:data.Phone,
                add:data.Add
            };
            store.put(value);
    }
    req.onerror=function () {
        alert('上传失败');
    }
}
//重置
function btnClear_onclick() {
    document.getElementById("tbxName").value="";
    document.getElementById("tbxPhone").value="";
    document.getElementById("tbxAdd").value="";
}


function removeAllData() {
    for(var i=datatable.childNodes.length-1;i>1;i--)
        datatable.removeChild(datatable.childNodes[i]);
}
//单击某表格行时调用
function tr_onclick(tr,i) {
    tr.setAttribute('style','color:red');
    NAME =tr.children.item(0).innerHTML;
}
function tr_onblur(tr,i){
    tr.setAttribute('style','color:black');
}

//显示留言联系人信息
function showAllData(loadPage) {
    if(!loadPage)
        removeAllData();
    var tx=idb.transaction(['customer'],"readonly");//开启事务
    var store=tx.objectStore('customer');
    var idx=store.index('nameIndex');
    var range = IDBKeyRange.lowerBound(1);
    var direction="next";
    var req =idx.openCursor(range,direction);
    var i=0;
    req.onsuccess=function () {
        var cursor = this.result;
        if(cursor){
            i+=1;
            showData(cursor.value,i);
            cursor.continue();
        }
    }
    req.onerror=function () {
        alert('检索数据失败');
    }
}

function showData(row,i) {
    var tr=document.createElement('tr');
    tr.setAttribute("onclick","tr_onclick(this,"+i+")");
    tr.setAttribute("onMouseout","tr_onblur(this,"+i+")");
    var td1=document.createElement('td');
    td1.innerHTML=row.name;
    var td2=document.createElement('td');
    td2.innerHTML=row.phone;
    var td3=document.createElement('td');
    td3.innerHTML=row.add;
    tr.appendChild(td1);
    tr.appendChild(td2);
    tr.appendChild(td3);
    datatable.appendChild(tr);
}

function btnDelete_onclick(){
    var tx=idb.transaction(['customer'],"readwrite");
    tx.oncomplete=function () {       //删除成功之后触发
        alert("删除数据成功");
        showAllData(false);
    }
    tx.onabort=function () {
        alert('删除数据失败');
    }
    var store=tx.objectStore('customer');
    var idx=store.index('nameIndex');
    var range = IDBKeyRange.only(NAME);
    var direction="next";
    var req =idx.openCursor(range,direction);
    req.onsuccess=function () {
        var cursor = this.result;
        if(cursor){
            cursor.delete();
        }
    }
    req.onerror=function () {
        alert('删除数据失败');
    }
}



